<template>
  <div class="app-main">
    <div class="layout-content">
      <keep-alive v-if="$route.meta.keepAlive">
        <router-view />
      </keep-alive>
      <router-view v-else />
    </div>
  </div>
</template>

<script>

export default {
  name: 'DeskApp',
  // 生命周期 - 创建完成（可以访问当前this实例）
  created() {},
  // 生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {},
  beforeCreate() {}, // 生命周期 - 创建之前
  beforeMount() {}, // 生命周期 - 挂载之前
  beforeUpdate() {}, // 生命周期 - 更新之前
  updated() {}, // 生命周期 - 更新之后
  beforeDestroy() {}, // 生命周期 - 销毁之前
  destroyed() {}, // 生命周期 - 销毁完成
  activated() {},
  methods: {
    onClickLeft() {

    },
    onClickRight() {

    },
    // swipe onChange
    onChange(index) {
      this.current = index
      // console.log(this.current+1);
    },
    // handelSwipeItem
    handelSwipeItem() {
      console.log('1111')
    }
  } // 如果页面有keep-alive缓存功能，这个函数会触发
}
</script>
<style lang="scss">
// $lineColor2: #07b0ab;
// $lineColor3: #fe9d48;
// $lineColor4: #e4403f;
// $lineColor5: #6188ff;
// $lineColor6: #F8F8F9;
// .app-container {
//   height: 100%;
//   // padding-bottom: 60px;
//   // background-image: linear-gradient(120deg, #{$lineColor2} 0%, #50e6bd 100%);
//   // background-image: linear-gradient(to right, #{$lineColor3} 0%, #ffc95c 100%);
//   // background-image: linear-gradient(to right, #{$lineColor4} 0%, #fb9296 100%);
//   background-image: linear-gradient(to top, #{$lineColor6} 0%, #dddddd 100%);
// }

.layout-content {
  margin: 0 auto;
  width: 100%;
}
</style>
